Time Series Visualization হলো একটি বিশেষ ধরনের গ্রাফ যা সময়ের সাথে ডেটার পরিবর্তন চিত্রিত করে। এটি সাধারণত geom_line() এবং geom_area() এর মাধ্যমে তৈরি করা হয়, যা লাইন গ্রাফ এবং এরিয়া গ্রাফের মাধ্যমে সময়ের সাথে ডেটার পরিবর্তন তুলে ধরে। গুগল চার্টেও এই ধরনের ভিজুয়ালাইজেশন তৈরি করা সম্ভব, যেখানে সময়ের সাথে ডেটার প্যাটার্ন, প্রবণতা এবং সম্পর্ক দেখা যায়।
এখানে আমরা Google Charts ব্যবহার করে Time Series Visualization তৈরি করার উপায় নিয়ে আলোচনা করব।
১. geom_line (Line Chart) ব্যবহার করে Time Series Visualization
Line Chart হলো একটি সাধারণ টাইম সিরিজ ভিজুয়ালাইজেশন, যেখানে সময়ের সাথে ডেটার পরিবর্তন লাইন দিয়ে দেখানো হয়। এটি ডেটার ট্রেন্ড বা প্যাটার্ন দেখাতে সাহায্য করে।
উদাহরণ: Time Series Visualization with geom_line
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
google.charts.load('current', {
packages: ['corechart', 'line']
});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var data = new google.visualization.DataTable();
data.addColumn('date', 'Date'); // সময়ের জন্য ডেট কলাম
data.addColumn('number', 'Sales'); // সেলস ডেটা
// সময় এবং সেলস ডেটা
data.addRows([
[new Date(2024, 0, 1), 1000],
[new Date(2024, 1, 1), 1200],
[new Date(2024, 2, 1), 1500],
[new Date(2024, 3, 1), 1300],
[new Date(2024, 4, 1), 1700],
[new Date(2024, 5, 1), 1600]
]);
var options = {
title: 'Sales Over Time',
curveType: 'function', // লাইনটি সোজা না, একটি কার্ভ হিসেবে দেখানো হবে
legend: { position: 'bottom' }
};
var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
chart.draw(data, options);
}
</script>
</head>
<body>
<div id="chart_div" style="width: 900px; height: 500px;"></div>
</body>
</html>
এখানে:
- new Date(2024, 0, 1): সময়ের তারিখ হিসেবে "2024, 0, 1" (যেমন জানুয়ারি 1, 2024) ব্যবহার করা হয়েছে।
- curveType: 'function': এটি লাইনকে মসৃণ (smooth) করবে, অর্থাৎ লাইনটি সোজা না হয়ে একটি কার্ভ আকারে দেখাবে।
২. geom_area (Area Chart) ব্যবহার করে Time Series Visualization
Area Chart হল একটি টাইম সিরিজ ভিজুয়ালাইজেশন যেটি Line Chart এর মতোই কাজ করে, তবে এর নিচের অংশটি পূর্ণ করে দেওয়া হয় যাতে ডেটার পরিমাণ বা পরিবর্তন আরও স্পষ্টভাবে দেখানো যায়। এটি ডেটার আগ্রহের পরিবর্তনকে আরও দৃশ্যমান এবং বোধগম্য করে তোলে।
উদাহরণ: Time Series Visualization with geom_area
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
google.charts.load('current', {
packages: ['corechart', 'area']
});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var data = new google.visualization.DataTable();
data.addColumn('date', 'Date'); // সময়ের জন্য ডেট কলাম
data.addColumn('number', 'Sales'); // সেলস ডেটা
// সময় এবং সেলস ডেটা
data.addRows([
[new Date(2024, 0, 1), 1000],
[new Date(2024, 1, 1), 1200],
[new Date(2024, 2, 1), 1500],
[new Date(2024, 3, 1), 1300],
[new Date(2024, 4, 1), 1700],
[new Date(2024, 5, 1), 1600]
]);
var options = {
title: 'Sales Over Time',
hAxis: { title: 'Date' },
vAxis: { title: 'Sales' },
legend: { position: 'bottom' },
areaOpacity: 0.4, // এরিয়া চার্টের নিচের অংশে স্বচ্ছতা নির্ধারণ করা
};
var chart = new google.visualization.AreaChart(document.getElementById('chart_div'));
chart.draw(data, options);
}
</script>
</head>
<body>
<div id="chart_div" style="width: 900px; height: 500px;"></div>
</body>
</html>
এখানে:
- areaOpacity: 0.4: এরিয়া চার্টের নিচের অংশের স্বচ্ছতা নির্ধারণ করে। এটি 0.4 মানে 40% স্বচ্ছ থাকবে, যা ডেটার প্রদর্শনকে আরো স্বচ্ছ ও সুন্দর করে তোলে।
- title:
Sales Over Timeহল চিত্রের শিরোনাম।
Line Chart এবং Area Chart এর তুলনা
| বৈশিষ্ট্য | Line Chart | Area Chart |
|---|---|---|
| ভিজ্যুয়াল ফর্ম | লাইন (স্ট্রেইট বা কার্ভ) | লাইন এবং এরিয়া (প্রান্তরূপিত ক্ষেত্র) |
| ডেটা চিত্রিত করা | সময়ের সাথে ডেটার সম্পর্ক দেখানো | সময়ের সাথে ডেটার পরিবর্তন এবং আয়তন দেখানো |
| ব্যবহার | ট্রেন্ড এবং প্যাটার্ন দেখাতে | স্নাতক আয়তন এবং পরিবর্তন বুঝাতে |
| উপযোগিতা | ছোট থেকে মাঝারি পরিসরের ডেটা | বড় পরিসরের পরিবর্তন এবং আয়তন তুলনা |
সারমর্ম
গুগল চার্টে geom_line() এবং geom_area() ব্যবহার করে Time Series Visualization তৈরি করা খুবই সহজ এবং কার্যকরী। Line Chart ডেটার ট্রেন্ড এবং প্যাটার্ন দেখানোর জন্য ব্যবহার করা হয়, যেখানে Area Chart ডেটার পরিমাণের পরিবর্তন বা সম্পর্ক পরিষ্কারভাবে দেখাতে সাহায্য করে। এই চার্টগুলো আপনার ডেটার সময়ভিত্তিক পরিবর্তন সহজে এবং কার্যকরভাবে উপস্থাপন করতে সক্ষম।
Read more
